import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:jinke/utils/util.dart';

import 'index.dart';
import 'widgets/widgets.dart';

class HomePage extends GetView<HomeController> {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var state = controller.state;
    return GetBuilder<HomeController>(
      builder: (_) {
        return Scaffold(
          backgroundColor: Colors.white,
          body: SizedBox(
            width: 1.sw,
            height: 1.sh,
            child: Stack(
              children: [
                const HomeHeader(),
                SafeArea(
                  top: true,
                  child: Column(
                    children: [
                      Row(
                        children: [
                          Container(
                            width: 60.r,
                            height: 56.r,
                          ),
                          Expanded(
                            child: Text(
                              '金科招引',
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                  color: ColorsUtil.white, fontSize: 17.sp),
                            ),
                          ),
                          InkWell(
                            onTap: () {
                              Get.toNamed(RouterPath.me);
                            },
                            child: Container(
                              width: 60.r,
                              padding: EdgeInsets.only(right: 12.r),
                              child: Text(
                                '我的',
                                textAlign: TextAlign.right,
                                style: TextStyle(
                                    color: ColorsUtil.white, fontSize: 17.sp),
                              ),
                            ),
                          ),
                        ],
                      ),
                      GetBuilder<HomeController>(
                        builder: ((controller) {
                          return Container(
                            height: 60.r,
                            child: ListView.separated(
                              padding: EdgeInsets.symmetric(horizontal: gap12),
                              scrollDirection: Axis.horizontal,
                              itemBuilder: ((context, index) {
                                var value = state.tabTitles[index];
                                return InkWell(
                                  onTap: () => controller.actionTab(index),
                                  child: Column(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: [
                                      SizedBox(
                                        height: 50.r,
                                        child: Row(
                                          children: [
                                            Image.asset(
                                              state.tabTitleIndex == index
                                                  ? value
                                                      .selectedIcon!.imgPathHome
                                                  : value.icon!.imgPathHome,
                                              height:
                                                  state.tabTitleIndex == index
                                                      ? 25.r
                                                      : 22.r,
                                              fit: BoxFit.fitHeight,
                                            ),
                                            SizedBox(
                                              width: 3.r,
                                            ),
                                            Text(
                                              value.text,
                                              style: TextStyle(
                                                  color: state.tabTitleIndex ==
                                                          index
                                                      ? ColorsUtil.white
                                                      : const Color(0xffefefef),
                                                  fontSize:
                                                      state.tabTitleIndex ==
                                                              index
                                                          ? 16.sp
                                                          : 14.sp),
                                            ),
                                          ],
                                        ),
                                      ),
                                      Visibility(
                                        visible: state.tabTitleIndex == index,
                                        child: Image.asset(
                                          'trangle_up.png'.imgPathProList,
                                          height: 10.r,
                                          fit: BoxFit.fitHeight,
                                        ),
                                      )
                                    ],
                                  ),
                                );
                              }),
                              separatorBuilder: ((context, index) {
                                return SizedBox(
                                  width: 20.r,
                                );
                              }),
                              itemCount: state.tabTitles.length,
                            ),
                          );
                        }),
                      ),
                      Expanded(
                        child: ClipRRect(
                          borderRadius: BorderRadius.vertical(
                            top: Radius.circular(8.r),
                          ),
                          child: PageView(
                            controller: state.pageCtrl,
                            children: state.pages,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        );
      },
    );
  }
}
